<template>
	<view class="wanl-goods">
		<!-- 导航条 -->
		<view class="cu-custom" :style="{ height: wanlsys.height + 'px' }">
			<view class="cu-bar fixed" :style="{ height: wanlsys.height + 'px', paddingTop: wanlsys.top + 'px' }">
				<view class="action" @tap="Back()"><text class="wlIcon-fanhui1"></text></view>
				<view class="search-form round">
					<text class="wlIcon-sousuo1 text-bold"></text>
					<swiper class="search-swiper placeholder" vertical autoplay circular interval="3000">
						<swiper-item @tap="productSearch('')">搜索商品</swiper-item>
					</swiper>
				</view>
				<view class="action">
					<!-- #ifndef MP -->
					<text class="wlIcon-fenxiangcopy" @tap="showModal('share')"></text>
					<!-- <text class="wlIcon-liebiaomoshi" @tap="showModal('menu')"></text> -->
					<text class="wlIcon-31gouwuche" @tap="toCart"></text>
					<!-- #endif -->
				</view>

				<view class="bar-bg solid-bottom" :style="{ top: wanlsys.height + 'px', opacity: headerOpacity }">
					<scroll-view scroll-x class="nav">
						<view class="flex justify-around text-center">
							<view class="cu-item " :class="selectAnchor==index?'text-orange cur':''"
								v-for="(anchor, index) in anchorlist" :key="anchor.name" @tap="toAnchor(index)">
								{{ anchor.name }}
							</view>
						</view>
					</scroll-view>
				</view>
				<!-- 直播 -->
				<view class="wan-live" v-if="goodsData.isLive" @tap="onLive(goodsData.isLive.id)">
					<view class="tag shadow-blur" :style="{top:wanlsys.height + 47 + 'px' }">
						<view class="text-center">
							<view class="live">
								<view class="wanLive-icon"> </view>
							</view>
							<text class="text-white margin-lr-xs"> 在直播 </text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 商品主图轮播 -->
		<view class="swiper-box" id="swiper">
			<swiper circular="true" autoplay="true" @change="swiperChange">
				<swiper-item v-for="(swiper, index) in goodsData.img" :key="index">
					<image :src="$wanlshop.oss(swiper, 400, 0)" mode="aspectFill" />
				</swiper-item>
			</swiper>
			<view class="indicator">{{ currentSwiper + 1 }}/{{ goodsData.img?goodsData.img.length:1 }}</view>
		</view>
		<!-- 产品 -->
		<view class="bg-white">

			<!-- 标题，分享 -->
			<view class="title padding-lr-bj padding-top-bj">
				<view class="name wanl-black text-lg text-cut-2">
					<!-- <view v-if="goodsData.shop.isself == 1" class="cu-tag radius margin-right-xs sm bg-red">自营</view> -->
					<text class="type_name">{{goodsData.sign}}</text>
					<text style="margin-left:10px;font-weight: 600;">{{ goodsData.title || '加载中...' }}</text>
				</view>
				<!-- <view class="share padding-top-bj" @tap="showModal('share')">
					<view class="button wanl-gray-light margin-bottom">
						<text class="wlIcon-fenxiangcopy margin-right-xs"></text>
						<text class="text-sm">分享</text>
					</view>
				</view> -->
			</view>

			<!-- 秒杀 -->
			<view v-if="goodsData.activity_type === 'seckill'" class="price-rush bg-gradual-red margin-bottom-sm">
				<view class="price align-center  padding-lr-bj">
					<view>
						<view class="text-price text-white text-xxl text-bold margin-right-xs">0<text
								class="text-lg">.00</text>
							<text class="margin-left-sm text-sm">已抢<text class="amount">0</text>件</text>
						</view>
						<view class="text-sm text-white text-price"><text class="text-dec">0.00</text></view>
					</view>
					<view>
						<view class="text-xs margin-bottom-xs">距结束还剩：</view>
						<wanl-countdown :time="1" :height="40" :width="40" :size="28" :colonsize="32" color="#ec008c"
							bcolor="#ffffff" bgcolor="#ffffff" coloncolor="#ffffff"></wanl-countdown>
					</view>
				</view>
			</view>
			<!-- 普通 -->
			<view v-else class="price margin-bottom-sm padding-lr-bj padding-top-bj align-start">
				<view v-if="goodsData.current_price">
					<view class="wanl-blue margin-right-xs" style="font-weight: 600;font-size:26rpx;">零售价:

						<text class='text-price' style="margin-right:10px;">

							<text class="yuan">{{ price_format("yuan", goodsData.current_price) }}</text>
							<text class="fen">.{{ price_format("fen", goodsData.current_price) }}</text>
							<text>/{{goodsData.unit_name}}</text>
						</text>
						<text class="wanl-red" v-if="goodsData.vip_show>0">
							会员价:<text class='text-price'>
								<text class="yuan">{{ price_format("yuan", vip_price) }}</text>
								<text class="fen">.{{ price_format("fen", goodsData.vip_price) }}</text>
								<text>/{{goodsData.unit_name}}</text>
							</text>

						</text>
					</view>
					<!-- <view class="text-sm wanl-gray text-dec">
						市场价
						<text class="text-price margin-left-xs ">{{ goodsData.market_price || 0.0 }}</text>
					</view> -->
				</view>
				<view class="follow wanl-black" v-if="goodsData.is_collect" @tap="follow">
					<text class="wlIcon-yiguanzhu1 text-red"></text>
					<text class="text-xs">已收藏</text>
				</view>
				<view class="follow wanl-black" v-else @tap="follow">
					<text class="wlIcon-gerenguanzhu"></text>
					<text class="text-xs">收藏</text>
				</view>
			</view>


			<view class="block text-min padding-lr padding-bottom-bj">
				<!-- <view class="wanl-gray">
					<text class="wlIcon-weizhi margin-right-xs"></text>
					{{ goodsData.shop.city ? goodsData.shop.city.split('/')[1] : '中国' }}
				</view> -->
				<!-- <view class="wanl-gray">
					快递费：
					<text class="text-price">{{ goodsData.freight.price }}</text>
				</view>
				<view class="wanl-gray">
					月销
					<text class="margin-left-xs">{{ goodsData.sales }}</text>
				</view> -->
			</view>
		</view>
		<!-- 营销 -->
		<view class="promotion text-sm">
			<!-- <view class="item" @tap="showModal('promotion')">
				<view class="label wanl-gray">促销</view>
				<view class="conten">
					<view class="promotion-header">
						<text class="wlIcon-31daifahuo wanl-red margin-right-xs"></text>
						参加一下活动，预计可省 <text class="wanl-red text-price margin-lr-xs">10.00</text> 元
					</view>
					<view class="promotion-header">
						<view class="cu-tag sm line-orange round margin-right-xs">
							满80包邮
						</view>
						购物满80元包邮
					</view>
					<view class="promotion-header">
						<view class="cu-tag sm line-orange round margin-right-xs">
							满二送一
						</view>买满二个送一，买满五送三
					</view>
				</view>
				<view class="bnt-quan wanl-gray">
					更多<text class="wlIcon-fanhui2 margin-left-xs"></text>
				</view>
			</view> -->
			<!-- <view class="item" @tap="showModal('coupon')" v-if="goodsData.coupon.length != 0">
				<view class="label wanl-gray">领券</view>
				<view class="conten flex ">
					<view class="wanl-ticket text-sm" v-for="(item, index) in goodsData.coupon" :key="index" v-if="index < 2">
						<block v-if="item.type == 'reduction' || (item.type == 'vip' && item.usertype == 'reduction')">
							<view class="ticket-price"> ￥{{Number(item.price)}} </view>
							<view class="ticket-title"> <text>满{{Number(item.limit)}}减{{Number(item.price)}}</text> </view>
						</block>
						<block v-if="item.type == 'discount' || (item.type == 'vip' && item.usertype == 'discount')">
							<view class="ticket-price"> {{Number(item.discount)}}折 </view>
							<view class="ticket-title"> <text>满{{Number(item.limit)}}打{{Number(item.discount)}}折</text> </view>
						</block>
						<block v-if="item.type == 'shipping'">
							<view class="ticket-price"> 包邮 </view>
							<view class="ticket-title"> <text>满{{Number(item.limit)}}元包邮</text> </view>
						</block>
					</view>
				</view>
				<view class="bnt-quan wanl-gray">
					更多<text class="wlIcon-fanhui2 margin-left-xs"></text>
				</view>
			</view> -->
		</view>
		<!-- 选择商品 -->
		<view class="choice margin-bottom-bj padding-bj text-sm bg-white text-bold">

			<view class="commodity padding-bottom-bj padding-top-bj" @tap="showModal('service')">
				<view class="opt">
					<view class="title text-sm">购买须知</view>
					<view class="option wanl-blue" v-if="goodsData.remark">
						<view class="selected">
							<block>
								{{ goodsData.remark }}
							</block>
						</view>
					</view>
				</view>
				<view class="text-min wanl-gray"><text class="wlIcon-fanhui2"></text></view>
			</view>
			<view class="commodity padding-bottom-bj padding-top-bj" @tap="showModal('attribute')">
				<view class="opt">
					<view class="title text-sm">服务</view>
					<view class="option wanl-blue" v-for="(item,index) in goodsData.service_name_view" :key="index">
						<view class="selected" style="margin-right:15rpx;"><text>{{item}}</text></view>
					</view>
				</view>
				<view class="text-min wanl-gray"><text class="wlIcon-fanhui2"></text></view>
			</view>
			<view class="commodity padding-bottom-bj padding-top-bj" @tap="showModal('option')">
				<view class="opt">
					<view class="title">规格</view>
					<view class="option">
						<view class="selected">
							<view v-if="canCount">

								<text class="margin-lr-xs" v-for="(item, index) in goodsData.good_sku_view"
									:key="index">{{ item }}</text>
							</view>
							<view v-else>
								<!-- <text class="margin-right-bj">已选</text> -->
								<text class="margin-right-xs" v-for="(name, key) in selectArr" :key="key">

									{{Stringdecode(name)}}
								</text>
							</view>
						</view>

						<!-- <view class="option-list">
							<view v-for="(item, index) in goodsData.good_sku_view" :key="index">
								<text class="cu-tag">
									{{ item }}
								</text>
								<text class="cu-tag" v-if="index == 0">更多规格可选</text>
							</view>
						</view> -->
					</view>
				</view>
				<view class="text-sm" style="font-weight: 600;">查看更多</view>
			</view>
		</view>
		<!-- 产品参数 -->
		<!-- <view class="choice margin-bottom-bj padding-bj text-sm bg-white">
			
		</view> -->
		<!-- 评论 -->
		<view class="comment margin-bottom-bj padding-bj bg-white" id="evaluate">
			<view class="head" @tap="onTag('')">
				<view class="goods-info-title text-bold  padding-bottom-bj"> 评价晒单</view>
				<view class="wanl-gray wanl-blue">
					<!-- {{ goodsData.comment_num > 0 ? parseInt((goodsData.praise / goodsData.comment_num) * 100) : 0 }}%好评率 -->
					<text class="wlIcon-fanhui2 margin-left-xs"></text>
				</view>
			</view>
			<!-- 标签 -->
			<!-- <view class="label margin-bottom padding-bottom solid-bottom">
				<view @tap="onTag('good')" class="cu-tag round">好评 ({{ goodsData.praise }})</view>
				<view @tap="onTag('pertinent')" class="cu-tag round">中评 ({{ goodsData.moderate }})</view>
				<view @tap="onTag('poor')" class="cu-tag round">差评 ({{ goodsData.negative }})</view>
				<view @tap="onTag('figure')" class="cu-tag round">有图 ({{ goodsData.comment_list.figure }})</view>
				<view @tap="onTag(index)" v-for="(item, index) in goodsData.comment_list.tag" :key="index" class="cu-tag round">{{ index }} ({{ item }})</view>
			</view> -->
			<!-- 获取一个评论 -->
			<view class="user" v-for="(item, index) in goodsData.comment" :key="item.id" @tap="onTag('')">
				<view class="userinfo">
					<view class="avatar">
						<view class="cu-avatar sm round margin-right-xs"
							:style="{ backgroundImage: 'url(' + $wanlshop.oss(item.avatar, 26, 26, 2, 'avatar') + ')' }">
						</view>
						<view class="text-sm wanl-gray">{{ item.nickname }}</view>
					</view>
					<wanl-rate :current="item.star_num" :disabled="true"></wanl-rate>
				</view>

				<view class="details text-min">
					<view class="margin-bottom-sm">{{ item.content }}</view>
					<view class="wanl-gray">规格：{{ item.good_sku }}</view>
				</view>
				<view class="grid flex-sub grid-square"
					:class="[item.img.length > 3 ? 'col-3' : 'col-' + item.img.length]" v-if="item.img.length != 0">
					<view class="bg-img" v-for="(image, index) in item.img" :key="index" v-if="index <= 3"
						:style="{ backgroundImage: 'url(' + $wanlshop.oss(image, 28, 28) + ')' }"></view>
				</view>
			</view>
			<!-- 查看更多 -->
			<view class="more" @tap="onTag('')"><text class="wanl-gray text-sm">查看全部</text><text
					class="wlIcon-fanhui4 margin-left-xs"></text></view>
		</view>
		<!-- 店铺 -->
		<!-- <view class="shop padding-bj solid-bottom bg-white"> -->
		<!-- <view class="shopinfo margin-bottom">
				<view class="cu-avatar lg radius-bock" :style="{ backgroundImage: 'url(' + $wanlshop.oss(goodsData.shop.avatar, 52, 52, 2, 'avatar') + ')' }"></view>
				<view class="shopname">
					<view class="text-df text-cut" style="width: 300rpx;">{{ goodsData.shop.shopname }}</view>
					<view class="wanl-gray text-min">{{ $wanlshop.toFormat(goodsData.shop.find_user.fans, 'thousand') }} 人关注店铺</view>
				</view>
				<view class="bnt">
					1.0.9升级
					<button class="cu-btn round line-orange margin-right-sm" @tap="onShopGoods(goodsData.shop_id)">全部宝贝</button>
					<button class="cu-btn round bg-gradual-orange" @tap="onShop(goodsData.shop_id)">进店逛逛</button>
				</view>
			</view> -->

		<!-- <view class="quality wanl-gray text-min">
				<view>
					宝贝描述
					<text class="">{{ goodsData.shop.score_describe }}</text>
					<view v-if="goodsData.shop.score_describe < 4.7" class="cu-tag round di">低</view>
					<view v-else class="cu-tag round gao">高</view>
				</view>
				<view>
					卖家服务
					<text class="wanl-orange">{{ goodsData.shop.score_service }}</text>
					<view v-if="goodsData.shop.score_service < 4.7" class="cu-tag round di">低</view>
					<view v-else class="cu-tag round gao">高</view>
				</view>
				<view>
					物流服务
					<text class="wanl-orange">{{ goodsData.shop.score_logistics }}</text>
					<view v-if="goodsData.shop.score_logistics < 4.7" class="cu-tag round di">低</view>
					<view v-else class="cu-tag round gao">高</view>
				</view>
			</view> -->
		<!-- </view> -->
		<!-- 店铺推荐 -->
		<!-- <view class="shop-recom padding-bj bg-white">
			<view class="head">
				<view class="">店铺推荐</view>
				1.0.9升级
				<view class="text-sm wanl-orange" @tap="onShop(goodsData.shop_id)">
					查看全部
					<text class="wlIcon-fanhui2 margin-left-xs"></text>
				</view>
			</view>
			<view class="recommend margin-bottom-xs">
				<view class="item" v-for="(item, index) in goodsData.shop_recommend" :key="item.id"
					@tap="onGoods(item.id)">
					<image :src="$wanlshop.oss(item.image, 125, 120)" mode="aspectFill"></image>
					<view class="text-sm margin-tb-xs text-cut">{{ item.title }}</view>
					<view class="text-price wanl-orange text-df">{{ item.price }}</view>
				</view>
			</view>
		</view> -->
		<!-- 分隔符 -->
		<!-- <wanl-divider width="60%">产品详情</wanl-divider> -->
		<view class="goods-info-title bg-white padding-bj text-bold">商品详情</view>
		<!-- 产品详情 -->
		<view class="wanl-goods-content bg-white" id="details" v-if="goodsData.content">
			<rich-text :nodes="goodsData.content"></rich-text>
		</view>
		<!-- 分隔符 -->
		<!-- <wanl-divider width="60%">推荐商品</wanl-divider> -->
		<!-- 猜你喜欢 -->
		<!-- <view id="recommend">
			<wanl-product :dataList="likeData" />
		</view> -->
		<!-- <uni-load-more :status="status" :content-text="contentText" /> -->
		<view class="safeAreaBottom"></view>
		<view class="WANL-MODAL text-sm" @touchmove.stop.prevent="moveHandle">
			<!-- 顶部 -->
			<view class="cu-modal top-modal" :class="modalName == 'menu' ? 'show' : ''" @tap="hideModal">
				<view class="wanl-modal-menu cu-dialog" @tap.stop=""><wanl-direct @change="hideModal" /></view>
			</view>
			<!-- 促销 -->
			<view class="cu-modal bottom-modal" :class="modalName == 'promotion' ? 'show' : ''" @tap="hideModal">
				<view class="cu-dialog" @tap.stop="">
					<view class="wanl-modal">
						<view class="head padding-bj">
							<view class="content">
								<view class="text-lg">促销</view>
							</view>
							<view class="close wlIcon-31guanbi" @tap="hideModal"></view>
						</view>
					</view>
				</view>
			</view>
			<!-- 优惠券 -->
			<view class="cu-modal bottom-modal" :class="modalName == 'coupon' ? 'show' : ''" @tap="hideModal">
				<view class="cu-dialog bg-bgcolor" @tap.stop="">
					<view class="wanl-modal">
						<view class="head padding-bj">
							<view class="content">
								<view class="text-lg">优惠券</view>
							</view>
							<view class="close wlIcon-31guanbi" @tap="hideModal"></view>
						</view>
						<!-- <scroll-view class="wanl-coupon scroll-y" scroll-y="true">
							<view v-for="(coupon, index) in goodsData.coupon" :key="index" :class="coupon.type"
								class="item margin-bottom-bj radius-bock">
								<image :src="$wanlshop.appstc('/coupon/bg_coupon_3x.png')" class="coupon-bg"></image>
								<image :src="$wanlshop.appstc('/coupon/img_couponcentre_received_3x.png')"
									class="coupon-sign" v-if="coupon.state"></image>
								<view class="item-left">
									<block
										v-if="coupon.type == 'reduction' || (coupon.type == 'vip' && coupon.usertype == 'reduction')">
										<view class="colour">
											<text class="text-price"></text>
											<text class="prices">{{Number(coupon.price)}}</text>
										</view>
										<view class="cu-tag wanl-gray-dark radius text-sm bg-white">
											满{{Number(coupon.limit)}}减{{Number(coupon.price)}}
										</view>
									</block>
									<block
										v-if="coupon.type == 'discount' || (coupon.type == 'vip' && coupon.usertype == 'discount')">
										<view class="colour">
											<text class="prices">{{Number(coupon.discount)}}</text>
											<text class="discount">折</text>
										</view>
										<view class="cu-tag wanl-gray-dark radius text-sm bg-white">
											满{{Number(coupon.limit)}}打{{Number(coupon.discount)}}折
										</view>
									</block>
									<block v-if="coupon.type == 'shipping'">
										<view class="colour">
											<text class="prices">包邮</text>
										</view>
										<view class="cu-tag wanl-gray-dark radius text-sm bg-white">
											满{{Number(coupon.limit)}}元包邮
										</view>
									</block>
								</view>
								<view class="item-right padding-bj">
									<view class="title">
										<view class="cu-tag sm radius margin-right-xs tagstyle">
											{{coupon.type_text}}
										</view>
										<text class="text-cut wanl-gray text-min">{{coupon.name}}</text>
									</view>
									<view class="content text-min">
										<view class="wanl-gray">

											<view v-if="coupon.grant != '-1'">
												<text class="wlIcon-dot"></text>目前仅剩余 {{coupon.surplus}} 张
											</view>

											<view v-if="coupon.drawlimit != 0">
												<text class="wlIcon-dot"></text>每人仅限领取 {{coupon.drawlimit}} 张
											</view>
											<block v-if="coupon.pretype == 'fixed'">
												<view>
													<text class="wlIcon-dot"></text>生效 {{coupon.startdate}}
												</view>
												<view>
													<text class="wlIcon-dot"></text>结束 {{coupon.enddate}}
												</view>
											</block>
											<block v-if="coupon.pretype == 'appoint'">
												<view v-if="coupon.validity == 0">
													<text class="wlIcon-dot"></text>未使用前 永久 有效
												</view>
												<view v-else>
													<text class="wlIcon-dot"></text>领取后 {{coupon.validity}} 天有效
												</view>
											</block>
										</view>
										<view class="cu-btn sm round" @tap="onReceive(index)" v-if="!coupon.state">
											<text>立即领取</text>
										</view>
									</view>
								</view>
							</view>
						</scroll-view> -->
						<view class="foot padding-lr-bj"><button
								class="cu-btn bg-gradual-orange round text-bold complete" @tap="hideModal">完成</button>
						</view>
					</view>
				</view>
			</view>
			<!-- 产品参数 -->
			<view class="cu-modal bottom-modal" :class="modalName == 'attribute' ? 'show' : ''" @tap="hideModal">
				<view class="cu-dialog text-bold" @tap.stop="">
					<view class="wanl-modal">
						<view class="head padding-bj">
							<view class="content">
								<view class="text-lg">服务</view>
							</view>
						</view>
						<scroll-view class="scroll-y" scroll-y="false" style="padding:0">
							<view class="table solid-bottom" style="padding-left:15px;">
								<view class="name wanl-gray">品牌</view>
								<view class="value">{{ goodsData.brand_name }}</view>
							</view>
							<view class="table solid-bottom" v-for="(item, index) in goodsData.service_name"
								:key="index" style="padding-left:15px;">
								<!-- <view class="name wanl-gray">{{ index }}</view> -->
								<view class="value">{{ item.service_name }}</view>
							</view>
						</scroll-view>
						<view class="foot padding-lr-bj"><button
								class="cu-btn bg-gradual-orange round text-bold complete" @tap="hideModal">完成</button>
						</view>
					</view>
				</view>
			</view>
			<!-- 分享 -->
			<view class="cu-modal bottom-modal" :class="modalName == 'share' ? 'show' : ''" @tap="hideModal">
				<view class="cu-dialog" @tap.stop="">
					<wanl-share :scrollAnimation="scrollAnimation" :shareTitle="goodsData.title"
						:shareText="goodsData.description" :image="$wanlshop.oss(goodsData.image,50, 50)"
						:href="common.appConfig.domain + '/pages/product/goods?id='+ goodsData.id +'&QRtype=goods'"
						isReport @change="wanlShare" />
				</view>
			</view>
			<!-- 服务 -->
			<view class="cu-modal bottom-modal" :class="modalName == 'service' ? 'show' : ''" @tap="hideModal">
				<view class="cu-dialog text-bold" @tap.stop="">
					<view class="wanl-modal">
						<view class="head padding-bj">
							<view class="content">
								<view class="text-lg">购买须知</view>
							</view>
						</view>
						<view class="listbox padding-bj">
							<view>
								<view class="name">
									{{ goodsData.remark }}
									<text class="wlIcon-fuwuxing"></text>
								</view>
								<!-- <view class="description wanl-gray text-min">{{ goodsData.remark }}</view> -->
							</view>
						</view>
						<view class="foot padding-lr-bj"><button
								class="cu-btn bg-gradual-orange round text-bold complete" @tap="hideModal">完成</button>
						</view>
					</view>
				</view>
			</view>
			<!-- 规格 -->
			<view class="cu-modal bottom-modal" :class="modalName == 'option' ? 'show' : ''" @tap="hideModal">
				<view class="cu-dialog" @tap.stop="">
					<view class="option wanl-modal">
						<view class="head text-left padding-bj solid-bottom">
							<view class="cu-avatar radius-bock margin-right"
								v-if="goodSku.good_sku && goodSku.good_sku.length>0"
								:style="{ backgroundImage: 'url(' + $wanlshop.oss(pic, 100, 100) + ')' }">
							</view>
							<view class="cu-avatar radius-bock margin-right" v-else
								:style="{ backgroundImage: 'url(' + $wanlshop.oss(goodsData.cover, 100, 100) + ')' }">
							</view>

							<view class="text-28">
								<view class="title text-bold margin-bottom-xs">
									{{goodsData.title}}
								</view>
								<view class=" margin-right-xs text-bold" style="font-size:26rpx;">
									<text class=" wanl-blue">零售价:
										<text class='text-price' style="margin-right:10px;">
											<text class="yuan">{{ price_format("yuan", current_price) }}</text>
											<text
												class="fen">.{{ price_format("fen", current_price) }}</text>/{{goodsData.unit_name}}
										</text></text>

								</view>
								<view class=" margin-right-xs text-bold" style="font-size:26rpx;">

									<text class=" wanl-orange" v-if="goodsData.vip_show>0">
										会员价:<text class='text-price'>
											<text class="yuan">{{ price_format("yuan", vip_price) }}</text>
											<text
												class="fen">.{{ price_format("fen", vip_price) }}</text>/{{goodsData.unit_name}}
										</text>
									</text>

								</view>
								<view v-if="selectArr.join('')" class="margin-bottom-xs margin-top-xs text-bold">
									库存 <text class="margin-lr-xs">{{kucun}}</text>
								</view>
								<view class="text-28 text-bold">
									<view v-if="selectArr.join('')" style="display:flex;justify-content:flex-start;">
										<view class="margin-right-bj">已选择</view>
										<view class="margin-right-xs" v-for="(name, key) in selectArr" :key="key">
											<view v-html="Stringdecode(name)"></view>
										</view>
									</view>
									<view v-else>
										<view v-if="goodsData.good_sku_view && goodsData.good_sku_view.length>0">
											请选择：
											<text class="wanl-gray-light"
												v-for="(item, index) in goodsData.good_sku_view" :key="index">
												<block v-if="index != 0">-</block>
												{{ item }}
											</text>
										</view>

									</view>
								</view>
							</view>

							<view class="close wlIcon-31guanbi" @tap="hideModal"></view>
						</view>
						<!-- 1.0.8升级 -->
						<scroll-view scroll-y="true" :style="{maxHeight: wanlsys.screenHeight / 2 + 'px'}">
							<view class="opt text-left padding-bj solid-bottom"
								v-for="(value, spukey) in goodSku.good_attr" :key="spukey" v-if="goodSku.good_attr">
								<view class="text-df text-bold">{{ value.name }}</view>
								<view class="tag text-bold">
									<view class="cu-tag text-sm" v-for="(item, index) in value.item" :key="index"
										:class="[item.ishow ? '' : 'noactive', subIndex[spukey] == index ? 'active' : '']"
										@tap="skuClick(item, spukey, $event, index)">
										<view v-html="Stringdecode(item.name)"></view>
										<span v-if="subIndex[spukey] == index && kucun==0"
											style="display:inline-block;border-radius:0.1rem;padding:0.01rem 0.03rem;background:#E90000;color:#fff;position:absolute;top:-0.30rem;right:-0.50rem;font-size:0.45rem">缺货</span>
									</view>
								</view>
							</view>
							<view class="number padding-bj text-bold" v-if="single_price>0">
								<view class="text-df text-bold">单价</view>
								<view>
									{{single_price}}元<span v-if="unit_name">/{{unit_name}}</span>
								</view>
							</view>
							<view class="number padding-bj text-bold" v-if="price>0">
								<view class="text-df text-bold">总价</view>
								{{price}}元
							</view>
							<view class="number padding-bj">
								<view class="text-df text-bold">购买数量</view>
								<uni-number-box :min="1" :max="kucun" :value="selectNum" :disabled="canCount"
									@change="changeNum"></uni-number-box>
							</view>
						</scroll-view>

						<view class="foot padding-lr-bj">
							<button v-if="isChoice" class="cu-btn bg-gradual-orange round text-bold complete"
								@tap="completeSelection">完成</button>
							<block v-else>
								<!-- <button class="cu-btn bg-gradual-yellow round-left text-bold"
									@tap="SubmitData('addToCart', 1)">加入购物车</button> -->
								<button class="bg-gradual-orange text-bold"
									@tap="SubmitData('placeOrder', 1)">确定</button>
							</block>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 底部 -->

		<view class="wanlian cu-bar tabbar shop solid-top foot">
			<!-- <view class="action" @tap="onShop(goodsData.shop_id)">
				<view class="wlIcon-dianpu1 wanl-orange"></view>
				店铺
			</view> -->
			<view class="action" @tap="toCart">
				<view class="wlIcon-gouwuche">
					<view class="cu-tag badge" v-if="cart.cartnum > 0">{{ cart.cartnum }}</view>
				</view>
				购物车
			</view>
			<!-- 1.0.2升级 -->
			<view class="action">
				<view class="wlIcon-kefu">
					<view class="cu-tag badge"></view>
				</view>
				客服
			</view>
			<view class="btn-group">
				<button class="cu-btn bg-gradual-orange round" @tap="SubmitData('addToCart')">加入购物车</button>
				<button class="cu-btn  bg-gradual-red round margin-left-lg"
					@tap="SubmitData('placeOrder')">立即购买</button>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				good_id: 0,
				// unit_name :'',
				// pic:'',
				is_vip: 0,
				type: 'good',
				current_price: '',
				vip_price: '',
				single_price: '',
				goodSku: {},
				TabCur: 0,
				wanlsys: {},
				modalName: null, // 弹出层
				durect: 0, // 角标
				headerOpacity: 0, //不透明度
				currentSwiper: 0, // 轮播图右下角数字
				anchorlist: [{
					name: '主图',
					top: 0
				}, {
					name: '评价',
					top: 0
				}, {
					name: '详情',
					top: 0
				}], //导航条锚点
				selectAnchor: 0,
				//产品数据
				goodsData: {
					id: 0,
					category_id: 0,
					shop_id: 0,
					brand_id: 0,
					freight_id: 0,
					title: '',
					image: '',
					images: '',
					flag: '',
					content: '',
					category_attribute: [],
					activity_type: 'goods',
					price: null,
					interval_price: null,
					market_price: null,
					sales: 0,
					brand: {},
					freight: {
						name: '',
						isdelivery: 1
					},
					payment: 0,
					comment: 0,
					praise: 0,
					moderate: 0,
					negative: 0,
					like: 0,
					views: 0,
					status: '',
					category: {},
					follow: true,
					sku: [],
					spu: [],
					promotion: [],
					coupon: [],
					comment_list: {
						data: [],
						figure: 0,
						tag: []
					},
					shop: {
						find_user: {
							fans: 0
						},
						city: ''
					},
					shop_recommend: {}
				},
				// 猜你喜欢
				reload: true,
				likeData: [],
				current_page: 1, //当前页码
				last_page: 1, //总页码
				status: 'loading',
				contentText: {
					contentdown: ' ',
					contentrefresh: '正在加载...',
					contentnomore: '没有更多数据了'
				},
				// 商品规格组合
				shopItemInfo: {}, //存放要和选中的值进行匹配的数据
				selectArr: [], //存放被选中的值
				subIndex: [], //是否选中 因为不确定是多规格还是但规格，所以这里定义数组来判断
				selectshop: {}, //存放最后选中的商品
				selectNum: 1, //选中数量
				isChoice: '', // 是否从选择进入
				scrollAnimation: 100 //分享滚动
			};
		},
		onLoad(option) {
			this.wanlsys = this.$wanlshop.wanlsys();
			this.good_id = option.good_id;
			option.token = uni.getStorageSync("wanlshop:user").token
			this.loadData(option);
			this.get_list(option)
			// this.loadlikeData();
			// #ifdef MP-WEIXIN
			wx.showShareMenu({
				withShareTicket: true,
				menus: ['shareAppMessage', 'shareTimeline']
			});
			// #endif

			// uni.request({
			// 	url: '/api/GoodCart/goodCartList',
			// 	method: 'POST',
			// 	data: {
			// 		// cart: cart ? cart: null,
			// 		token: uni.getStorageSync("wanlshop:user").token
			// 	},
			// 	success: res => {
			// 		console.log(res.data)
			// 		// dispatch('format', res.data);
			// 	}
			// });
			// this.durect =
			// 	this.$store.state.statistics.notice.notice +
			// 	this.$store.state.statistics.notice.order +
			// 	this.$store.state.statistics.notice.chat +
			// 	this.$store.state.statistics.order.pay +
			// 	this.$store.state.statistics.order.delive +
			// 	this.$store.state.statistics.order.receiving +
			// 	this.$store.state.statistics.order.evaluate;
		},
		onShow() {
			// alert(JSON.stringify(this.$route.query))
			// if (uni.getStorageSync("wanlshop:user").token) {
			// 	let data = {
			// 		good_id: this.good_id,
			// 		token: uni.getStorageSync("wanlshop:user").token
			// 	}
			// 	this.loadData(data);
			// 	this.get_list(data)
			// }
		},
		//发送给微信好友
		onShareAppMessage(res) {
			console.log("分享：from:" + res.from);
			return {
				title: this.goodsData.title, //分享的名称
				path: '/pages/product/goods?good_id=' + this.goodsData.id, //页面的路径
			}
		},
		//分享到朋友圈
		onShareTimeline(res) {
			return {
				title: this.goodsData.title,
				type: 0,
				path: '/pages/product/goods?good_id=' + this.goodsData.id,
				imageUrl: this.goodsData.cover,
			}
		},
		onPageScroll(e) {
			//导航栏渐变
			let tmpY = 150;
			e.scrollTop = e.scrollTop > tmpY ? 150 : e.scrollTop; //如果当前高度大于250则250否则当前高度
			this.headerOpacity = e.scrollTop * (1 / tmpY); //$headerOpacity 赋值当前高度x（1÷250）
		},
		onReachBottom() {
			//判断是否最后一页
			if (this.current_page >= this.last_page) {
				this.status = 'noMore';
			} else {
				this.reload = false;
				this.current_page = this.current_page + 1; //页码+1
				this.status = 'loading';
				this.loadlikeData();
			}
		},
		watch: {
			selectshop(n, o) {
				if (n.price != o.price) {
					// 更新一次优惠券
					// this.queryCoupon(n.price);
				}
			}
		},
		computed: {
			canCount() {
				// alert(this.subIndex)
				return this.subIndex.some(item => item === -1);
			},
			unit_name: function() {
				let unit_name = '';
				let name = '';
				if (this.selectshop.good_sku) {
					name = this.selectshop.good_sku;
				} else if (this.goodsData.good_sku_view) {
					name = this.goodsData.good_sku_view.join('|');
				}
				console.log(name)
				//二〇二一年八月二十二日 07:21:28
				if (this.goodsData.unit_name) {
					unit_name = this.goodsData.unit_name
				}

				if (this.goodSku.good_attr) {
					this.goodSku.good_attr.forEach(function(el) {
						// console.log(JSON.stringify(el))
						if (el.name == '包装规格' || el.name == '计价单位') {
							el.sub.forEach(function(elm) {
								// console.log(JSON.stringify(elm))
								if (name.indexOf(elm) != -1) {
									unit_name = elm;
								}

							})
						}
					});
					console.log(unit_name)
				}
				return unit_name;
			},
			pic: function() {
				let that = this;
				let pic = '';
				let name = '';
				if (this.selectshop.good_sku) {
					name = this.selectshop.good_sku;
				} else if (this.goodsData.good_sku_view) {
					name = this.goodsData.good_sku_view.join('|');
				}
				// alert(name)
				if (this.goodSku.good_sku) {
					this.goodSku.good_sku.forEach(function(el) {
						if (name === el.good_sku) {
							// alert(el.cover)
							if (el.stock_num) {
								// console.log(999)
								pic = el.cover;
							} else {
								pic = that.goodsData.img[0]
							}

						}
						// else {
						// 	pic = this.goodsData.img[0]
						// }
					})
				}

				// console.log(pic)
				return pic;
			},
			kucun: function() {
				let that = this;
				var kucun = false;
				let name = ''
				if (!this.goodsData.good_sku_view) {
					return this.goodsData.stock_num;
				}

				// alert(this.goodSku.good_attr.length)


				if (this.goodsData.good_sku_view && this.goodSku.good_attr && this.goodsData.good_sku_view.length !=
					this.goodSku.good_attr.length) {
					this.selectNum = 0

					return;
				}

				if (this.selectshop.good_sku) {
					name = this.selectshop.good_sku;
				} else if (this.goodsData.good_sku_view) {
					name = this.goodsData.good_sku_view.join('|');
				}



				this.goodSku.good_sku.forEach(function(el) {
					if (name === el.good_sku) {
						if (el.stock_num > 0) {
							kucun = el.stock_num;

							that.count = 1
						} else {
							kucun = 0
							that.count = 0
						}
					}
				})
				if (!kucun) {
					kucun = 0;
					that.count = 0
				}
				// alert(kucun)
				return kucun;
			},

			price: function() {

				let that = this;

				if (this.is_vip == 1 && this.goodsData.vip_price > 0) { //2022年3月15日07:25:06
					var price = this.goodsData.vip_price;
					this.single_price = this.goodsData.vip_price;

					this.vip_price = this.goodsData.vip_price;
					this.current_price = this.goodsData.current_price;

				} else {
					var price = this.goodsData.current_price;
					this.single_price = this.goodsData.current_price;

					this.vip_price = this.goodsData.vip_price;
					this.current_price = this.goodsData.current_price;
				}



				// alert(JSON.stringify(this.current_price))
				if (this.selectshop.good_sku && this.goodSku.good_sku) {
					var name = this.selectshop.good_sku;
					this.goodSku.good_sku.forEach(function(el) {
						console.log(666)
						console.log(name)
						console.log(el.good_sku)
						if (name === el.good_sku) {
							// this.sku_id = el.sku_id;
							// alert(JSON.stringify(el.price,null,2))
							// if (el.stock_num) { //2022年3月28日22:13:12
							if (that.is_vip == 1 && el.vip_price > 0) {
								price = el.vip_price;

								that.vip_price = el.vip_price;
								that.current_price = el.price;
							} else {
								price = el.price;
								that.vip_price = el.vip_price;
								that.current_price = el.price;
							}
							console.log(87)
							console.log(price)
							// this.current_price = el.price
							that.single_price = price.toFixed(2);
							// } else {}
						}

						// console.log(this.sku_id)
					})
				}

				// alert(name)

				// alert(this.current_price)
				// this.selectNum = this.selectNum > 0 ? this.selectNum : 1;
				// console.log(price)
				if (this.selectNum > 0) {
					return (price * this.selectNum).toFixed(2);
				} else {
					return (price * 1).toFixed(2);
				}

			},
			getCarnum: function() {
				uni.request({
					url: '/api/GoodCart/xcx_goodCartCount',
					data: {
						token: uni.getStorageSync("wanlshop:user").token,
					},
					success: res => {
						console.log(res)

					}
				});
			},
			...mapState(['cart', 'common'])
		},
		methods: {
			Stringdecode(str) {
				str = decodeURIComponent(this.$base64.decode(str.replace(/\s/g, '+')));
				return str;
			},
			replaceImg({
				str,
				width = 200,
				height = 300
			}) {
				str = str.replace(/(<img[^>]*>)|(<img[^>]*><\/img>)/g, function(match, capture) {
					if (match.indexOf('style') < 0) {
						// 没有style 就添加一个
						return match.replace(/<\s*img/, '<img style=""');
					} else {
						// 有style 就不做处理 直接返回
						return match
					}
				})
				console.log("增加style=\"\"后的html字符串：" + str);
				str = str.replace(/<img[^>]*>/gi, function(match, capture) {
					return match.replace(/style\s*?=\s*?([‘"])[\s\S]*?\1/ig,
						'style="width:100%;height:auto;margin:0 auto; display:block;"') // 替换style
				})
				console.log('htmlstr', str)
				return str
			},
			price_format: function(type, price) {
				var status = (price + "").indexOf(".");
				if (status == "-1") {
					if (type == "yuan") {
						return price;
					}
					if (type == "fen") {
						return "00";
					}
				}
				var price_array = (price + "").split(".");
				if (type == "yuan") {
					return price_array[0];
				}
				if (type == "fen") {
					var price_fen = price_array[1].length < 2 ? price_array[1] + "0" : price_array[1];
					return price_fen;
				}
			},
			Back() {
				//uni.navigateBack()//默认delta:1
				uni.navigateBack({
					delta: 1, //返回层数，2则上上页
				})
			},
			async get_list(option) {
				// alert(this.type)

				await uni.request({
					url: '/api/Good/goodSku',
					data: {
						good_id: option.good_id,
						is_tuan: 0,
						type: 'good',
						token: uni.getStorageSync("wanlshop:user").token
					},
					success: res => {

						this.goodSku = res.data
						this.is_vip = res.data.is_vip
					}
				});

			},
			async loadData(option) {
				option.token = uni.getStorageSync("wanlshop:user").token
				//加载商品
				await uni.request({
					url: '/api/Good/goodDetails',
					data: option,
					success: res => {
						console.log(res.data)


						//详情正则
						// res.data.content = res.data.content.replace(
						// 	/<img [^>]*src=['"]([^'"]+)[^>]*>/gi, (match, capture) => {
						// 		var img =
						// 			`<img style="display: block; max-width: 100%;text-align:center" src="${this.$wanlshop.oss(capture, 500, 0)}">`;
						// 		return img;
						// 	});
						// console.log(7777)
						// console.log(res.data.content)
						// 价格区间
						// if (res.data.sku.length == 0) {
						// 	res.data.interval_price = res.data.price;
						// 	res.data.market_price = res.data.price;
						// }else{
						// 	let price = [],
						// 		market_price = [];
						// 	for (let value of res.data.sku) {
						// 		price.push(value.price);
						// 		market_price.push(value.market_price);
						// 	}
						// 	let minPrice = Math.min.apply(null, price),
						// 		maxPrice = Math.max.apply(null, price),
						// 		maxMarketPrice = Math.max.apply(null, market_price);
						// 	res.data.interval_price = minPrice == maxPrice ? Number(minPrice).toFixed(2) : ( minPrice + '-' + Number(maxPrice).toFixed(2) ); //区间价格
						// 	res.data.market_price = Number(maxMarketPrice).toFixed(2); //最大市场价
						// }
						this.goodsData = res.data;
						// 商品规格组合
						if (this.goodSku.good_attr) {
							this.goodSku.good_attr.map((item, index) => {


								// 1.1.3升级
								item.item.map((name, key, arr) => {

									arr[key].name = this.$base64.encode(encodeURIComponent(arr[key].name))

								});
								// this.$set(this.goodSku.good_attr[index+1].item[0], 'ishow',
								// 	true);
								// this.selectArr.push('');
								// this.subIndex.push(-1);

							});
							// console.log(console.log(item))
						}
						console.log(789)
						// alert(JSON.stringify(this.goodSku.good_attr));

						if (this.goodSku.good_sku) {
							// 1.1.3升级
							this.goodSku.good_sku.map(item => {
								item.difference.map((name, index, arr) => {
									arr[index] = this.$base64.encode(encodeURIComponent(name))
								});
							});
						}

						console.log(789)
						// alert(JSON.stringify(this.goodSku.good_sku));
						console.log(this.goodSku.good_sku);

						//    console.log(this.goodSku.good_sku);
						this.checkItem(); //计算sku里面规格形成路径
						this.checkInpath(-1); //传-1是为了不跳过循环

						if (this.goodSku.good_attr) {
							this.goodSku.good_attr.map((item, index) => {
								// this.skuClick(item.item, index, $event, index)
								if (item.item) {
									this.$set(this.selectArr, index, item.item[0].name);
								}

								this.$set(this.subIndex, index, 0);
								this.checkInpath(index);

								// alert(JSON.stringify(this.selectArr))

								console.log(this.goodSku.good_attr[index])

								// alert(JSON.stringify(this.goodSku.good_attr[1].item[0]))
								this.$set(this.goodSku.good_attr[index].item[0], 'ishow',
									true);

								if (this.selectArr.every(item => item != '')) {
									this.selectshop = this.shopItemInfo[this.selectArr];

									// 1.1.3升级
									// this.selectshop.difference.map((name, index, arr) => {
									// 	arr[index] = this.$base64.decode(name)
									// })
									// this.loadStock(this.selectshop.id);
									this.selectNum = 1;

								}
								console.log(this.selectshop)
							});
						}



						// 计算锚点高度
						// setTimeout(() => {
						// this.calcAnchor();
						// }, 1000);
					}
				});

			},
			// 滚动底部加载猜你喜欢
			async loadlikeData() {
				await uni.request({
					url: '/wanlshop/product/likes?pages=goods',
					data: {
						page: this.current_page
					},
					success: res => {
						this.likeData = this.reload ? res.data : this.likeData.concat(res.data
							.data); //评论数据 追加
						this.current_page = res.data.current_page; //当前页码
						this.last_page = res.data.last_page; //总页码
						this.status = 'more';
					}
				});
			},
			// 查询优惠券，减缓服务器压力，单独查询
			async queryCoupon(price) {
				await uni.request({
					url: '/wanlshop/coupon/query',
					method: 'POST',
					data: {
						shop_id: this.goodsData.shop_id,
						goods_id: this.goodsData.id,
						shop_category_id: this.goodsData.shop_category_id,
						price: price
					},
					success: res => {
						this.goodsData.coupon = res.data;
					}
				});
			},
			// 领取优惠券
			async onReceive(index) {
				let coupon = this.goodsData.coupon[index];
				await uni.request({
					url: '/wanlshop/coupon/receive',
					method: 'POST',
					data: {
						id: coupon.id
					},
					success: res => {
						coupon.id = res.data.id;
						coupon.state = true;
						this.$wanlshop.msg(res.data.msg);
						// 更新状态管理器
						this.$store.commit('statistics/dynamic', {
							coupon: this.$store.state.statistics.dynamic.coupon + 1
						});
					}
				});
			},
			async loadStock(sku_id) {
				await uni.request({
					url: '/wanlshop/product/stock',
					data: {
						sku_id: sku_id
					},
					success: res => {
						console.log(res);
						this.selectshop.stock = res.data;
					}
				});
			},
			// 商品规格组合 选择
			skuClick(value, spukey, event, index) {
				// alert(JSON.stringify(value))
				// alert(JSON.stringify(spukey))
				if (value.ishow) {
					if (this.selectArr[spukey] != value.name) {

						this.$set(this.selectArr, spukey, value.name);
						this.$set(this.subIndex, spukey, index);
					} else {
						this.$set(this.selectArr, spukey, '');
						this.$set(this.subIndex, spukey, -1);
					}
					console.log(this.selectArr)
					console.log(this.subIndex)
					this.checkInpath(spukey);
					//如果全部选完
					console.log(this.shopItemInfo)
					if (this.selectArr.every(item => item != '')) {
						this.selectshop = this.shopItemInfo[this.selectArr];
						console.log(this.selectshop)
						// 1.1.3升级
						this.selectshop.difference.map((name, index, arr) => {
							arr[index] = this.Stringdecode(name)
						})
						// this.loadStock(this.selectshop.id);
						this.selectNum = 1;

					}
				}
			},
			//循环所有属性判断哪些属性可选
			checkInpath(clickIndex) {
				if (this.goodSku.good_attr) {
					//当前选中的兄弟节点和已选中属性不需要循环
					for (let i = 0, len = this.goodSku.good_attr.length; i < len; i++) {
						if (i == clickIndex) {
							continue;
						}
						let len2 = this.goodSku.good_attr[i].item.length;
						for (let j = 0; j < len2; j++) {
							if (this.subIndex[i] != -1 && j == this.subIndex[i]) {
								continue;
							}
							let choosed_copy = [...this.selectArr];
							console.log(888)
							console.log(this.goodSku.good_attr[i].item[j].name)
							this.$set(choosed_copy, i, this.goodSku.good_attr[i].item[j].name);
							let choosed_copy2 = choosed_copy.filter(item => item !== '' && typeof item !== 'undefined');
							if (this.shopItemInfo.hasOwnProperty(choosed_copy2)) {
								console.log(6789)
								console.log(this.goodSku.good_attr[i])
								this.$set(this.goodSku.good_attr[i].item[j], 'ishow', true);
							} else {
								this.$set(this.goodSku.good_attr[i].item[j], 'ishow', false);
							}
						}
					}
					console.log(7890)
				}

				// console.log(this.goodsData.spu)
			},
			//计算有多小种可选路径
			checkItem() {
				if (this.goodSku.good_sku) {
					let result = this.goodSku.good_sku.reduce(
						(arrs, items) => {
							return arrs.concat(
								items.difference.reduce(
									(arr, item) => {
										return arr.concat(
											arr.map(item2 => {

												//利用对象属性的唯一性实现二维数组去重
												if (!this.shopItemInfo.hasOwnProperty([...item2, item])) {
													// alert(item2)

													this.shopItemInfo[[...item2, item]] = items;
												}

												return [...item2, item];
											})
										);
									},
									[
										[]
									]
								)
							);
						},
						[
							[]
						]
					);
					console.log(7890)
					console.log(this.shopItemInfo)
				}

			},
			//商品规格修改数量
			changeNum(val) {
				// alert(JSON.stringify(this.selectArr))
				if (this.selectArr.length == 0) {
					// this.$wanlshop.msg('请选择完成规格');
					return;
				}
				// alert(JSON.stringify(this.kucun))
				if (this.kucun > 0) {
					let num = parseInt(val);
					if (num > this.kucun) {
						this.$wanlshop.msg(`数量不能超过库存 ${this.selectshop.stock} 件`);
						this.selectNum = parseInt(this.kucun);
					} else {
						this.selectNum = parseInt(val);
					}
				}

				// alert(this.selectNum)
			},
			//轮播图指示器
			swiperChange(e) {
				this.currentSwiper = e.detail.current;
			},
			// 弹出层
			showModal(name) {
				this.isChoice = '';
				// 滚动下分享
				if (name == 'share' && this.modalName != 'share') {
					setTimeout(() => {
						this.scrollAnimation = 0;
					}, 300);
				}
				this.modalName = name;
			},
			// 关闭弹出层
			hideModal(name) {
				if (name) {
					this.showModal(name);
				} else {
					this.modalName = null;
				}
			},
			// 分享回调
			wanlShare(e) {
				if (e) {
					this.$wanlshop.auth(`/pages/user/complaint/complaint?id=${this.goodsData.id}&type=1`);
				} else {
					this.modalName = null;
				}
			},
			//禁止父元素滑动
			moveHandle() {},
			// 关注 & 取消
			async follow() {
				this.goodsData.is_collect = !this.goodsData.is_collect;
				// 全局控制中心
				// if (this.goodsData.is_collect) {
				// 	this.$store.commit('statistics/dynamic', {
				// 		collection: this.$store.state.statistics.dynamic.collection + 1
				// 	});
				// } else {
				// 	this.$store.commit('statistics/dynamic', {
				// 		collection: this.$store.state.statistics.dynamic.collection - 1
				// 	});
				// }
				await uni.request({
					url: '/api/opera/opera',
					method: 'POST',
					data: {
						data_id: this.goodsData.id,
						source: 'good',
						token: uni.getStorageSync("wanlshop:user").token,
						type: 2
					},
					success: res => {
						this.goodsData.is_collect = res.data;
						console.log(this.goodsData.is_collect)
					}

				});
			},
			//跳转锚点
			toAnchor(index) {
				this.selectAnchor = index;
				uni.pageScrollTo({
					scrollTop: this.anchorlist[index].top,
					duration: 200
				});
			},
			//计算锚点高度
			calcAnchor() {
				let query = null;
				// 支付宝小程序不能加后面的.in(this)，是它自身的限制
				// #ifndef MP-ALIPAY
				query = uni.createSelectorQuery().in(this)
				// #endif
				// #ifdef MP-ALIPAY
				query = uni.createSelectorQuery()
				// #endif
				query.select('#evaluate').boundingClientRect(rec => {
					this.anchorlist[1].top = rec.top - this.wanlsys.height - 45;
				}).exec();
				query.select('#details').boundingClientRect(rec => {
					this.anchorlist[2].top = rec.top - this.wanlsys.height - 45;
				}).exec();
				query.select('#recommend').boundingClientRect(rec => {
					this.anchorlist[3].top = rec.top - this.wanlsys.height - 45;
				}).exec();
			},
			// 评论页
			onTag(tag) {
				this.$wanlshop.to('/pages/product/comment?id=' + this.goodsData.id + '&praise=' + this.goodsData.praise +
					'&tag=' + tag);
			},
			// 打开购物车
			toCart() {
				uni.switchTab({
					url: '/pages/cart'
				});
			},
			// 完成选择
			completeSelection() {
				// alert(this.canCount)
				if (this.canCount) {
					this.$wanlshop.msg('请选择完成规格');
				} else {
					this.ProcessingData();
				}
			},
			// 提交数据
			SubmitData(name, type) {

				if (!uni.getStorageSync("wanlshop:user").token) {
					this.$wanlshop.to('/pages/user/auth/auth');
					return
				}


				// if (!this.subIndex[0]) {
				// this.$wanlshop.msg('客官先别急，系统还在加载');
				// } else {

				// }
				if (type == 1) {
					if (this.canCount) {
						this.$wanlshop.msg('请选择完成规格');
					} else {
						this.isChoice = name;
						this.ProcessingData();
					}
				} else {
					this.modalName = 'option';
					this.isChoice = name;
				}
			},
			ProcessingData() {
				let that = this
				// alert(this.selectNum)
				if (this.count == '0') {
					this.$wanlshop.msg('您当前选择的商品没有库存')
					return;
				}


				if (this.isChoice == 'addToCart') {

					let goods = {
						shop_id: this.goodsData.shop_id,
						// shop_name: this.goodsData.shop.shopname,
						good_id: this.goodsData.id,
						title: this.goodsData.title,
						good_num: this.selectNum,
						image: this.goodsData.cover,
						sku: this.selectshop,
						sku_id: this.selectshop.id,
						current_price: this.single_price,
						good_sku: this.selectshop.good_sku,
						peisong_type_id: this.goodsData.peisong_type_id,
						peisong_type_name: this.goodsData.peisong_type_name,
						sum: this.$wanlshop.bcmul(this.single_price, this.selectNum)
					};



					goods.token = uni.getStorageSync("wanlshop:user").token

					uni.request({
						url: '/api/GoodCart/createGoodCart',
						method: 'POST',
						data: goods,
						success: res => {
							// if (type == 'follow') {
							// rootState.statistics.dynamic.collection = rootState.statistics.dynamic
							// 	.collection + res.data;
							// }
						}
					});

					this.$store.dispatch('cart/add', goods);
					this.$store.dispatch('cart/login');
					this.$wanlshop.msg('已加购物车');

					// uni.request({
					// 	url: '/api/GoodCart/checkGoodCart',
					// 	method: 'POST',
					// 	data: {
					// 		good_cart_id: this.selectshop.id,
					// 		token: uni.getStorageSync("wanlshop:user").token
					// 	},
					// 	success: res => {
					// 		console.log(res.data)
					// 		// dispatch('format', res.data);
					// 	}
					// });

				} else if (this.isChoice == 'placeOrder') {
					let goodsData = [{
						good_id: this.goodsData.id,
						good_num: this.selectNum,
						sku_id: this.selectshop.id,
						cover: this.goodsData.cover,
						title: this.goodsData.title,
						current_price: this.price / this.selectNum,
						good_sku: this.selectshop.good_sku,
						// good_num: this.selectNum,
						// barnd_id: this.brand_id,
						// sku_id: this.sku_id,
						// unit_name: this.unit_name,
						peisong_type_id: this.goodsData.peisong_type_id,
						peisong_type_name: this.goodsData.peisong_type_name,
					}];
					// 提交订单
					if (uni.getStorageSync("wanlshop:user").token) {
						uni.redirectTo({
							url: `/pages/user/order/addorder?order_type=groups&data=${JSON.stringify(goodsData)}`
						});
					} else {
						this.$wanlshop.to('/pages/user/auth/auth');
					}

				} else {
					this.$wanlshop.msg('数据异常');
				}
				this.hideModal();
			},
			productSearch(text) {
				this.$wanlshop.to(`/pages/product/search?type=goods&keywords=${text}`, 'fade-in', 100);
			}
		}
	};
</script>

<style>
	toast,
	uni-toast {
		z-index: 9999;
	}

	.yuan {
		font-size: 34rpx;
		font-weight: 600;
	}

	.fen {
		font-size: 30rpx;
		font-weight: 600;
	}

	.wanl-goods-content {
		text-algin: center
	}

	.wanl-goods-content img {
		width: 100%;
		text-algin: center;
	}


	.type_name {
		/* position: absolute; */
		background: #ff243a;
		/* left: 0;
		bottom: 0; */
		padding: 5rpx;
		height: 20px;
		line-height: 20px;
		/* box-sizing: border-box; */
		/* z-index: 111; */
		color: #fff;
		font-size: 24rpx;
		margin-right: 5px;
	}

	.cu-custom .cu-bar .search-form {
		background-color: #fff;
	}

	.cu-custom .cu-bar {
		background-color: #f3f3f3;
	}

	.cu-custom .bar-bg {
		background-color: rgba(243, 243, 243, 0.96);
	}

	.cu-custom .cu-bar {
		z-index: 99;
	}

	/* #ifdef MP */
	.cu-custom .cu-bar .search-form {
		margin: 0 0 0 25rpx;
	}

	/* #endif */

	.cu-custom .cu-bar .nav .cu-item {
		line-height: 70rpx;
		height: 70rpx;
	}

	.swiper-box {
		position: relative;
		width: 100%;
		height: 100vw;
	}

	.swiper-box swiper {
		width: 100%;
		height: 100vw;
	}

	.swiper-box swiper swiper-item image {
		width: 100%;
		height: 100vw;
	}

	.swiper-box .indicator {
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 0 25upx;
		height: 40upx;
		border-radius: 40upx;
		font-size: 22upx;
		position: absolute;
		bottom: 20upx;
		right: 20upx;
		color: #fff;
		background-color: rgba(0, 0, 0, 0.2);
	}

	.goods-info-title:after {
		content: '';
		position: absolute;
		width: 0.15rem;
		background: linear-gradient(360deg, rgba(167, 233, 255, 1) 0%, rgba(0, 90, 147, 1) 100%);
		left: 0.3rem;
		height: 0.7rem;
		margin-top: 0.2rem;
	}

	.wlIcon-31guanbi:before {
		font-size: 42rpx;
	}
</style>